import React, { Component } from 'react';

import Header from "./header"; //输入框
import List from "./list"; //列表
import "../../../../案例练习作业/4.1发表评论.css";

class ComponentIndex extends Component {

  state = { 
    list:[
      {
        title:'小明',
        count:"你好楼主"
      }
    ]
   }

  //  点击发表
  updateList =(mag) => { //msg是子组件heder传过来的
    // console.log(mag);
    let data = [...this.state.list] //1.把数据解构出来
    data.push(mag)               //2.push给子组件传过来的msg
    this.setState({              //3.赋值给list
      list: data
    })
  }

  render() { 
    return ( 
      <>
        <div className='root'>
          <Header updateList={this.updateList}></Header> {/*子传父 把子组件的数据传过来*/}
          <List list={this.state.list}></List> {/*父传子 把获取到的值传给列表页面*/}
        </div>
      </>
     );
  }
}
 
export default ComponentIndex;